<script setup lang='ts'>
import { ref } from 'vue';


defineProps({
  product: {
    type: Object,
    default: {}
  },
  type: {
    type: String,
    default: 'half' // half, lesser
  }
});

const itemWidth = ref({
  half: 340,
  lesser: 250
});


</script>

<template>
  <view :style="{ width: `${itemWidth[type]}rpx` }" style="aspect-ratio: 9/14;">
    <view class="image w-full bg-gray-200" style="aspect-ratio: 1/1;">
      <img :src="product.product_image" class="w-full h-full object-cover" />
    </view>
    <view class="info">
      <view class="title text-sm font-bold leading-middle">标题</view>
      <view class="describe text-xs text-gray-500 mt-1">Lorem ipsum dolor sit amet consectetur, adipisicing elit</view>
      <view class="price text-red-600 font-bold">
        <span class="text-xs">￥</span>
        <span>7000</span>
        <span class="text-xs">.00</span>
        <span class="text-xs">元</span>
      </view>
    </view>
  </view>
</template>

